<template>
  <div class="task-commit">
    <van-nav-bar class="header"
      left-arrow
      @click-left="onBack()"
    >
      <template #title>
        <p style="font-size: 16px;color: #333333;font-weight: 400;">{{title}}</p>
      </template>
      <template #left>
        <van-icon name="arrow-left" size="18" color="#3B3938" />
      </template>
    </van-nav-bar>
    <van-form ref="formTaskCommit" style="margin: 16px 0px; height: calc(100vh - 140px);" label-width="80px">
      <van-cell-group inset>
        <van-field-select v-if="operation.type === SysFlowTaskOperationType.FREE_JUMP"
          label="任务节点" required
          v-model="formData.targetTaskKey"
          :dataList="jumpTaskList"
          placeholder="请选择跳转任务节点"
          :prop="{
            label: 'name',
            value: 'id'
          }"
        />
        <user-select
          ref="userSelect"
          v-if="showAssignSelect || operation.type === SysFlowTaskOperationType.FREE_JUMP"
          label="指派用户" required
          :filterObject="otherFilterObject"
          v-model="userName"
          :multiple="true"
        />
        <van-field-select v-if="operation.type === SysFlowTaskOperationType.SIGN_REDUCTION"
          label="减签用户" required
          v-model="formData.assignee"
          :dataList="multiSignAssignees.dropdownList"
          :prop="{
            label: 'showName',
            value: 'assignee'
          }"
        />
        <van-field-select v-if="processInstanceId != null && taskId != null && operation.type === SysFlowTaskOperationType.REJECT_TO_TASK"
          label="驳回节点" required
          v-model="formData.targetTaskKey"
          :dataList="taskWidget.dropdownList"
          :prop="{
            label: 'showName',
            value: 'taskKey'
          }"
        />
        <van-field
          v-if="
            operation.type !== SysFlowTaskOperationType.CO_SIGN &&
            operation.type !== SysFlowTaskOperationType.SIGN_REDUCTION &&
            operation.type !== SysFlowTaskOperationType.MULTI_SIGN &&
            operation.type !== SysFlowTaskOperationType.BFORE_CONSIGN &&
            operation.type !== SysFlowTaskOperationType.AFTER_CONSIGN
          "
          label="审批意见" required
          v-model="formData.message"
          type="textarea"
          autosize maxlength="50"
          show-word-limit
          :rules="rules.message"
        />
      </van-cell-group>
    </van-form>
    <van-row style="padding: 0px 16px;" type="flex">
      <van-button type="primary" size="normal" style="flex-grow: 1;" @click="onSubmitClick">确定</van-button>
    </van-row>
  </div>
</template>

<script>
import { DropdownWidget } from '@/utils/widget.js';
import { FlowOperationController } from '@/api/flowController.js';

export default {
  props: {
    title: {
      type: String
    },
    operation: {
      type: Object
      // required: true
    },
    processInstanceId: {
      type: String
    },
    processDefinitionId: {
      type: String
    },
    taskId: {
      type: String
    },
    finishedInfo: {
      type: Object
    }
  },
  data () {
    return {
      formData: {
        message: undefined,
        assignee: undefined,
        targetTaskKey: undefined
      },
      multiSignAssignees: new DropdownWidget(this.listMultiSignAssigneesDropdownData),
      taskWidget: new DropdownWidget(this.loadTaskWidgetDropdownData),
      rules: {
        message: [{required: true, message: '审批意见不能为空', trigger: 'blur'}],
        assignee: [{required: true, message: '指派用户不能为空', trigger: 'blur'}],
        targetTaskKey: [{required: true, message: '任务节点不能为空', trigger: 'blur'}]
      },
      userName: [],
      otherFilterObject: undefined,
      jumpTaskList: []
    }
  },
  methods: {
    onBack (success = false, data) {
      this.$emit('close', success, data);
    },
    onSubmitClick () {
      this.$refs.formTaskCommit.validate().then(res => {
        if (Array.isArray(this.userName) && this.userName.length > 0) {
          let selectUser = this.$refs.userSelect ? this.$refs.userSelect.getSelectItems() : [];
          this.formData.assignee = selectUser.map(item => item.loginName).join(',');
        }
        this.onBack(true, this.formData);
      }).catch(e => {});
    },
    loadTaskWidgetDropdownData () {
      return new Promise((resolve, reject) => {
        FlowOperationController.listRejectCandidateUserTask(this, {
          processInstanceId: this.processInstanceId,
          taskId: this.taskId
        }).then(res => {
          resolve(res.data);
        }).catch(e => {
          reject(e);
        });
      });
    },
    listMultiSignAssigneesDropdownData () {
      return new Promise((resolve, reject) => {
        FlowOperationController.listMultiSignAssignees(this, {
          processInstanceId: this.processInstanceId,
          taskId: this.taskId
        }).then(res => {
          // 将已经处理过会签任务的处理人放到列表最后
          resolve(res.data.sort((val1, val2) => {
            return val1.approved === val2.approved ? 0 : (val1.approved ? 1 : -1);
          }));
        }).catch(e => {
          reject(e);
        });
      });
    },
    loadAllUserTask () {
      FlowOperationController.listAllUserTask(this, {
        processDefinitionId: this.processDefinitionId
      }).then(res => {
        this.jumpTaskList = res.data;
      }).catch(e => {
        console.log(e);
      });
    }
  },
  computed: {
    showAssignSelect () {
      let showAssignSelect = false;
      // 如果是会签操作，判断是否在流程内设置了会签人
      if (this.operation.type === this.SysFlowTaskOperationType.MULTI_SIGN) {
        showAssignSelect = !this.operation.multiSignAssignee ||
          !Array.isArray(this.operation.multiSignAssignee.assigneeList) ||
          this.operation.multiSignAssignee.assigneeList.length <= 0;
      }
      return [
        this.SysFlowTaskOperationType.TRANSFER,
        this.SysFlowTaskOperationType.CO_SIGN,
        this.SysFlowTaskOperationType.BFORE_CONSIGN,
        this.SysFlowTaskOperationType.AFTER_CONSIGN,
        this.SysFlowTaskOperationType.SET_ASSIGNEE
      ].indexOf(this.operation.type) !== -1 || showAssignSelect;
    },
    multiSelect () {
      // 转办、加签、会签允许多选
      return [
        this.SysFlowTaskOperationType.CO_SIGN,
        this.SysFlowTaskOperationType.MULTI_SIGN,
        this.SysFlowTaskOperationType.BFORE_CONSIGN,
        this.SysFlowTaskOperationType.AFTER_CONSIGN,
        this.SysFlowTaskOperationType.TRANSFER,
        this.SysFlowTaskOperationType.SET_ASSIGNEE
      ].indexOf(this.operation.type) !== -1;
    }
  },
  mounted () {
    if (this.operation && this.operation.type === this.SysFlowTaskOperationType.SET_ASSIGNEE && this.operation.multiSignAssignee) {
      if (this.operation.multiSignAssignee.assigneeType && this.operation.multiSignAssignee.assigneeList) {
        this.otherFilterObject = {
          USER_FILTER_GROUP: JSON.stringify({
            type: this.operation.multiSignAssignee.assigneeType,
            values: this.operation.multiSignAssignee.assigneeList
          })
        };
      }
    }
    if (this.operation.type === this.SysFlowTaskOperationType.SIGN_REDUCTION) {
      this.multiSignAssignees.onVisibleChange(true).catch(e => {});
    }
    if (this.processInstanceId != null && this.taskId != null && this.operation.type === this.SysFlowTaskOperationType.REJECT_TO_TASK) {
      this.taskWidget.onVisibleChange(true).catch(e => {});
    }
    if (this.processDefinitionId != null && this.operation.type === this.SysFlowTaskOperationType.FREE_JUMP) {
      this.loadAllUserTask();
    }
  }
}
</script>

<style>
</style>
